<!DOCTYPE html>
<html lang="zh_CN">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<style>
    div{
        width: 200px;
        height: 200px;
    }
    .box1{
        background-color: red;
    }
    .box2{
        background-color: green;
        position: relative;
        /*有定位，肯定要设置移动的距离 left right top bottom*/
        left: 10px;
        top: 10px;

        /*一般相对定位都是为做其他定位的参照使用，自己单独做相对定位较少，一般在微调的时候使用。*/
    }
    .box3{
        background-color: blue;
    }

    /* postion: relative absolute fixed*/

</style>
<!-- 网页里面定位： 1. 相对定位 relative 2. 绝对定位 absolute 3. 固定定位 fixed-->

<!--相对定位： 相对自身进行定位，不会脱离标准文档流（不会投标），还是在标准文档流里面，以自己的左上角作为参考点-->
</body>
<div class="box1"></div>
<div class="box2"></div>
<div class="box3"></div>
</html>